<?php if (!defined('THINK_PATH')) exit(); /*a:1:{s:39:"./views/home/mobile/invite\poster.phtml";i:1627629214;}*/ ?>
<!DOCTYPE html>
<html>

	<head>
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<meta charset="UTF-8">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
		<title>邀请好友</title>
		<link rel="shortcut icon" href="clientapp/images/new_images/favicon.ico" />
		<link href="/static/home/mobile/css/reset_5.css" rel="stylesheet" type="text/css" />
		<link href="/static/home/mobile/css/style.css" rel="stylesheet" type="text/css" />
		<link href="/static/home/mobile/css/new_style.css" rel="stylesheet" type="text/css" />
		<link href="/static/home/mobile/css/weui.min.css" rel="stylesheet" type="text/css" />
		<link href="/static/home/mobile/css/jquery-weui.min.css" rel="stylesheet" type="text/css" />
		<link href="/static/home/mobile/css/plugin.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="/static/home/mobile/js/jquery.min.js"></script>
        <script src="/static/home/mobile/js/qrcode/jquery.qrcode.min.js"></script>
        <script src="https://cdn.bootcss.com/layer/2.3/layer.js"></script>
        <script type="text/javascript" src='/static/home/mobile/js/vconsole.min.js'></script>
        <script type="text/javascript" src="/static/home/mobile/js/kefu/plugin.js"></script>
        <script type="text/javascript" src="/static/home/mobile/js/kefu/weui.min.js"></script>
        <script type="text/javascript" src="/static/home/mobile/js/kefu/jquery-weui.min.js"></script>
	</head>
	<style type="text/css">
		* {
			margin: 0px;
			padding: 0px;
		}

		html {
			font-size: 62.5%;
		}

		body {
			font-family: "微软雅黑", "Microsoft Yahei", "Arial";
			font-size: 1.0rem;
			background: #F5F5F5;
			line-height: 1.5;
			color: #333;
			overflow-x: hidden;
			overflow-y: auto;
			-webkit-overflow-scrolling: touch;
		}

		a {
			text-decoration: none;
			-webkit-transition: all 0.3s ease-in-out;
			transition: all 0.3s ease-in-out;
			color: #333;
		}

		.notice-lists {
			padding-top: 80px;
			width: 96%;
			max-width: 1200px;
			margin: 0 auto;
		}

		.notice-lists ul li {
			margin-bottom: 10px;
		}

		.notice-lists ul li a {
			display: block;
			background: #fff;
			padding: 8px 10px;
		}

		.notice-lists ul li a .notice-title {
			display: inline-block;
			width: calc(100% - 150px);
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}

		.notice-lists ul li a .notice-time {
			width: 140px;
			float: right;
		}
		.content{
        top:0;
        background: url('/static/home/mobile/images/haibao.jpg');
        background-size: 100% 100%;
        height:calc(100% - 47px);
    }
    .site-header{
	 background: url('/static/home/mobile/images/haibao.jpg');
	 background:rgba(0,0,0,0);
}
	</style>

<body style="background:url('/static/home/mobile/images/haibao.jpg') no-repeat 100% 20px;background-size: 100% 100% ;background-position:top;background-color: #333;overflow-x:hidden;">
		<!--<div class="site-header header-fixed" style="background:#0f8eef;">
			<a onclick="history.back()" class="back" style="background:none;margin-top:-10px;" >
	            <img style="height:24px;" src='/static/home/mobile/images/return2.png'>
	        </a>
			<div class="tit-name" style="color:#fff;">二维码推广</div>
		</div>-->
		</head>
    <div class="site-header header-fixed">
        <a onclick="history.back()" class="back"></a>
        <div class="tit-name">邀请好友</div>
    </div>

<div style="height:220px;width:220px;margin:0 auto;margin-top:380px;border-radius:10px;background:#fff;z-index:2;padding-top:1px;">

<div style="background:url('/static/home/mobile/images/haibao_1.png') no-repeat;background-size: 100% auto;height:200px;width:200px;z-index: 3;margin:0 auto;text-align:center;margin-top:18px;">
<img id="myimg"style="width: 160px;height: 160px;margin-top:15px;">

</div>


</div>
 <span style="margin-top:20px;text-align:center;display:block;font-size:14px;">我的邀请码：<?php echo $member['invitation_code']; ?></span>
 <span style="margin-top:20px;text-align:center;display:block;font-size:14px;" id="url1"><?php echo $linkregis; ?>?i=<?php echo $member['invitation_code']; ?></span>
 
<div onclick="show_poster()" style="width:90%;background:#2254F4;margin-left:5%;height:50px;line-height: 50px;font-size:18px;margin-top:30px;margin-bottom:30px;text-align: center;color:#fff;border-radius: 6px;">
		分享海报
</div>   
<div id="copyss" data-clipboard-action="copy"  data-clipboard-target="#url1" style="width:90%;background:#2254F4;margin-left:5%;height:50px;line-height: 50px;font-size:18px;margin-top:30px;margin-bottom:30px;text-align: center;color:#fff;border-radius: 6px;">
		复制邀请链接
</div>
 <div id="qrcode" style="display:none"></div>

  <canvas id="myCanvas"  style="display:none;"></canvas>
<style>
	.haibao{
		width:80%;
		height:auto;
		background: #fff;
		top:50px !important;
	}
</style>
    <script>
       // var vConsole = new VConsole();
    </script>



    <link rel="stylesheet" href="/static/plugins/dialog/css/dialog.css" />
    <script src="/static/plugins/dialog/lib/zepto.min.js"></script>
    <script src="/static/plugins/dialog/js/dialog.js"></script>
    <!-- 弹出层 -->
    <script type="text/javascript" src="/static/home/mobile/js/global.js"></script>
<script>
var page=1;
var qrurl = "<?php echo $linkregis; ?>?i=<?php echo $member['invitation_code']; ?>";
  $('#qrcode').qrcode({
    text: qrurl,
    render: "canvas",
    width : 150,
    height : 150
   });
var qd = $('#qrcode').find("canvas")[0];
            var base64 = qd.toDataURL('image/jpeg');

            $('#myimg').attr('src',base64);
            
            
$(document).ready(function () {
    var clipboard = new ClipboardJS('#copyss');
    clipboard.on('success', function(e) {
        console.log(11510);
        $.toast("复制推广链接成功");
        e.clearSelection();
    });
});
</script>
<script>
	function  circleImg(ctx, img, x, y, r){
	    ctx.save();
	    var d =2 * r;
	    var cx = x + r;
	    var cy = y + r;
	    ctx.arc(cx, cy, r, 0, 2 * Math.PI);
	    ctx.clip();
	    ctx.drawImage(img, x, y, d, d);
	    ctx.restore();
	  }

</script>
<script>
var a=1;
  function show_poster(){
    if(typeof(api) != "undefined"){api.showProgress()}
      //画海报
    var width = 750; //宽度
    var height = 1334; // 高度
    var c = document.getElementById("myCanvas");
    c.width = width
    c.height = height
    var ctx = c.getContext("2d");
    //首先画上背景图
    var img = new Image();
    img.src = '/static/home/mobile/images/poster.jpg';
    img.setAttribute("crossOrigin", 'Anonymous')

    ctx.font = "26px Georgia";
    ctx.fillStyle = "#fff";


    //画上二维码
    function convertCanvasToImage(canvas) {
     var image = new Image();
     image.src = canvas.toDataURL("image/png");
     return image;
    }
    var mycans = $('canvas')[0];//二维码所在的canvas

    var codeimg = convertCanvasToImage(mycans)
    var xw = width - 100-100
    var xh = height - 100-50
    
    
var codeimg = convertCanvasToImage(mycans)
    var xw = width - 100 - 140
    var xh = height - 100-210

    //头像
    var head='<?php echo $member['avatar']; ?>'
    var headimg = new Image();
    headimg.setAttribute("crossOrigin", 'Anonymous')
    headimg.src = head;

    img.onload = function() { //必须等待图片加载完成
     ctx.drawImage(img, 0, 0, width, height); //绘制图像进行拉伸

	//   circleImg(ctx,headimg,30,height-130,50)
    // ctx.drawImage(headimg,30, height-130, 100, 100);

    // ctx.fillText("<?php echo $member['nickname']; ?>", 150, height-100);
     
    // ctx.fillText('邀您加入闲猫', 150,height-40 );
     ctx.drawImage(codeimg, xw, xh, 150, 150);
     //绘制完成,转为图片
     setTimeout(function() { //在ios上无法在画完之后取到整个画布内容，加了个settimeout
     var bigcan = $('canvas')[1];
     let images = new Image();
     images.src = bigcan.toDataURL("image/png");
    /* alert(bigcan.toDataURL("image/png"))*/
     images.setAttribute("crossOrigin", 'Anonymous')

	if(a>1){
		imgurl =  images.src;
// 			  layer.open({
// 			  type: 1,
// 			  title: '',
// 			  closeBtn: 1,
// 			  shadeClose: true,
// 			  skin: 'haibao',
// 			  content:`
			  
// 			  <img  src="`+  images.src  +`">
// 			  <div style="font-size:16px;text-align:center;padding:10px;" onclick="downloadImg()"> 保存图片</div>
// 			  `
// 			});
        if(typeof(api) != "undefined"){
            //上传文件
            // var file = dataURLtoFile(imgurl,"share-"+new Date().getTime()+".png");
            // var form = new FormData();
            // form.append("file", file);
            // $.ajax({
            //     url: "/home/task/upimg",
            //     type: "POST",
            //     contentType: "multipart/form-data",
            //     data: form,
            //     async: false, //异步
            //     processData: false, //很重要，告诉jquery不要对form进行处理
            //     contentType: false, //很重要，指定为false才能形成正确的Content-Type
            //     success: function(res) {
            //         if(res) {
            //             api.hideProgress();
            //               var sharedModule = api.require('shareAction');
            //               sharedModule.shareUrl({
            //                  text: '任务分享',
            //                  url: "http://daohang.mingge168168.com"+res.img
            //               });
            //         }
            //     },
            //     error: function() {
            //         AlertMsg("连接网络错误，请稍后再试");
            //     }
            // });
             var trans = api.require('trans');
              trans.saveImage({
                  base64Str: imgurl.split(",")[1],
                  imgPath:"fs://img/",// 图片路径
                  imgName:"share.png"// 图片名字
              }, function(ret, err) {
                  api.hideProgress();     
                  if (ret.status) {
                      // 拼接图片路径
                      var imgN =  api.fsDir + '/'+'img'+'/'+'share.png';
                      var imgs = [''+imgN];
                      // 保存图片到相册
                     var sharedModule = api.require('shareAction');
                     sharedModule.shareImage({
                         text: '零钱猫',
                         images: imgs
                     });
                  } else {
                      console.log(JSON.stringify(err));
                  }
              });
              
            
                  
              
              
        }else{
            message("请到APP上操作",'',"error");
        }

	}
	a+=1;

     }, 2)
    }



  }
  
  //将base64转换为文件对象
    function dataURLtoFile(dataurl, filename) {
      var arr = dataurl.split(',');
      var mime = arr[0].match(/:(.*?);/)[1];
      var bstr = atob(arr[1]);
      var n = bstr.length; 
      var u8arr = new Uint8Array(n);
      while(n--){
          u8arr[n] = bstr.charCodeAt(n);
      }
      //转换成file对象
      return new File([u8arr], filename, {type:mime});
      //转换成成blob对象
      //return new Blob([u8arr],{type:mime});
    }

  
  show_poster()
  
  function dataURLtoFile(dataurl, filename = 'file') {
          let arr = dataurl.split(',')
          let mime = arr[0].match(/:(.*?);/)[1]
          let suffix = mime.split('/')[1]
          let bstr = atob(arr[1])
          let n = bstr.length
          let u8arr = new Uint8Array(n)
          while (n--) {
              u8arr[n] = bstr.charCodeAt(n)
          }
          return new File([u8arr], `${filename}.${suffix}`, {
              type: mime
          })
   }
  
  var imgurl = "";
  function downloadImg(){
      if(imgurl){
          if(typeof(api) != "undefined"){
              
             smsPermission(true);
             
          }
      }
  }
  
  // 将base64字符串图片保存到本地
    function saveImageFunc() {
        
        api.showProgress({
            title: '保存中'
        });
      var trans = api.require('trans');
      trans.saveImage({
          base64Str: imgurl.split(",")[1],
          imgPath:"fs://img/",// 图片路径
          imgName:"parentid_code.png"// 图片名字
      }, function(ret, err) {
          if (ret.status) {
              // 拼接图片路径
              var imgN =  api.fsDir + '/'+'img'+'/'+'parentid_code.png';
              // 保存图片到相册
              savePhoto(imgN);
          } else {
              console.log(JSON.stringify(err));
          }
      });
    }
    
    //保存图片到相册
    function savePhoto(imgN){
        api.saveMediaToAlbum({
          path: imgN
        }, function(ret, err) {
          if (ret && ret.status) {
            api.toast({
                msg: '保存成功',
                duration: 2000,
                location: 'middle'
            });
          } else {
            alert('保存失败');
          }
          api.hideProgress()
        });
    }
  
  function download(){
        api.showProgress({
            title: '保存中'
        });
        api.download({
            url:imgurl,
            savePath: 'fs://share-qrcode-'+new Date().getTime+'.jpg',
            report: true,
            cache: false,
            allowResume: true
        },function(ret, err){
		    if(ret.state == 1){
			    var url = ret.savePath;
			    alert(url)
		        api.saveMediaToAlbum({
			     	path: url
		        }, function(ret, err){
		            if(ret && ret.status){
		                 api.toast({msg:'保存成功~请到相册查看'});
		            }else{
		                api.toast({msg:'保存失败'});
		            }
            		api.hideProgress()
		        });
		    }
		});
    }
    
    var lists = ['storage'];
    var storageStatus=false,locationStatus=false;
    function smsPermission(status){
        var resultList = api.hasPermission({
            list:lists
        });
        console.log("permiss===="+JSON.stringify(resultList));
        for(var i=0;i<lists.length;i++){
            if(resultList[i].name=='location'){
                locationStatus = resultList[i].granted?'true':'false'
            }
            if(resultList[i].name=='storage'){
                storageStatus = resultList[i].granted?'true':'false'
            }
            console.log(resultList[i].name)
        }
        if(storageStatus == 'true'){
            saveImageFunc();
        }else{
	        api.requestPermission({
	            list:lists,
	            code:10000000001
	        }, function(ret, err){
	        //    api.alert({
	        //        msg:'获取'+JSON.stringify(ret)
	        //    });
	            for(var i=0;i<lists.length;i++){
		            if(resultList[i].name=='location'){
		                locationStatus = resultList[i].granted?'true':'false'
		            }
		            if(resultList[i].name=='storage'){
		                storageStatus = resultList[i].granted?'true':'false'
		            }
	            }
	            
		         saveImageFunc();
		        
	        });
        }
        
    }
    
</script>
</body>
</html>